<template>
  <el-container>
    <el-main>

      <el-form ref="shippingForm" :model="shippingForm"  label-width="110px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="司机姓名" prop="carId">
              <el-select style="width: 100%" v-model="shippingForm.carId" filterable placeholder="请选择">
                <el-option
                  v-for="item in carList"
                  :key="item.id"
                  :label="item.driverName"
                  :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="送货线路" prop="name">
              <el-input v-model="shippingForm.name"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item class="addBotton">
          <el-button type="primary" :loading="loading" @click="saveShipping('shippingForm')">保存新增</el-button>
        </el-form-item>
      </el-form>
    </el-main>
  </el-container>
</template>

<script>
  import {update,find} from '@/api/shippingLine'
  import {list} from '@/api/car'
  import { EventBus } from '@/api/eventBus'

  export default {
    name: 'shippingLine-edit',
    data(){
      return{
        loading:false,
        carList:[],
        shippingForm:{
          id:'',
          name:'',
          carId:'',
        }
      }
    },
    created() {
      this.shippingForm.id=this.$route.query.id
      this.loadShipping()
      this.loadCar()
    },
    methods:{
      loadShipping(){
        find(this.shippingForm.id).then(res=>{
            this.shippingForm=res.data.shippingLine
        })
      },
      loadCar(){
        var params=new URLSearchParams()
        params.append('pageSize',1000)
        list(params).then(res=>{
          this.carList=res.data.data
        })
      },
      saveShipping(shippingForm){
        this.$refs[shippingForm].validate((valid) => {
          if (valid){
            this.loading=true
            update(this.shippingForm).then(res=>{
              this.loading=false
              EventBus.$emit('shippingLine-edit', res.data)
              this.$store.dispatch('tagsView/delView', this.$route).then(({visitedViews}) => {
                this.$router.push({
                  path: '/shippingLine/list'
                })
              })// 关闭当前tab回到列表
            }).catch(error=>{
              this.loading=false
            })
          }
        })
      },
    }
  }
</script>

<style scoped>

</style>
